<template>
  <home />
  <div class="contents">
    <el-card style="min-width: 800px;height: 600px">
      <template #header>
        <div class="card-header">
          <span style="display: flex;justify-content: center;font-size: 20px">
            {{ detailData.user }}</span>
        </div>
      </template>
      <div>
        <el-image src="https://guanhuaer.oss-cn-chengdu.aliyuncs.com/login.jpg" />
        {{detailData.address}}
      </div>
      <template #footer>{{detailData.date}}</template>
    </el-card>
  </div>
</template>
<script setup>
import {useRoute} from 'vue-router'
import home from '../welcome/Home.vue'
const route = useRoute()
const detailData = route.query

</script>

<style scoped>
.contents {
  width: 990px;
  height: 600px;
  margin: 0 auto;
  margin-top: 20px;
}
.el-card{
  width: 500px;
  height: 300px;
  flex: 1 0 24%;
  max-width: 24%;
  margin: 0 1%;
  box-sizing: border-box;
}
.demo-image__lazy {
  height: 400px;
  overflow-y: auto;
}
.demo-image__lazy .el-image {
  display: block;
  min-height: 200px;
  margin-bottom: 10px;
}
.demo-image__lazy .el-image:last-child {
  margin-bottom: 0;
}
</style>
